import 'package:pornhub_app/components/keep_alive_wrapper.dart';
import 'package:pornhub_app/components/tab_bar_indicator/tab_indicator.dart';
import 'package:pornhub_app/utils/color.dart';
import 'package:pornhub_app/utils/extension.dart';
import 'package:pornhub_app/views/mine/attention/controllers/attention_page_controller.dart';
import 'package:pornhub_app/views/mine/attention/views/creator_page.dart';
import 'package:pornhub_app/views/mine/attention/views/producer_page.dart';
import 'package:pornhub_app/views/mine/attention/views/star_page.dart';

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

class AttentionPage extends GetView<AttentionPageController> {
  AttentionPage({super.key});

  final tabs = ['明星', '创作者', '出品方'];

  @override
  Widget build(BuildContext context) {
    return SafeArea(
        top: false,
        child: DefaultTabController(
          length: tabs.length,
          child: Scaffold(
            appBar: _buildAppBar(context),
            body: _buildContentView(context),
          ),
        ));
  }

  AppBar _buildAppBar(BuildContext context) {
    return AppBar(
      leading: Container(
        padding: EdgeInsets.all(20.w),
        child: Image.asset(
          "assets/images/icons/base_ic_back_white.png",
          width: 9.w,
          height: 16.w,
        ),
      ).onOpaqueTap(() {
        onBackClick(context);
      }),
      title: TabBar(
        tabs: tabs.map((e) => Tab(text: e)).toList(),
        labelStyle: TextStyle(
          color: COLOR.hexColor("#eb29c6"),
          fontSize: 17.sp,
          fontWeight: FontWeight.w500,
        ),
        unselectedLabelStyle: TextStyle(
          color: COLOR.hexColor("#fff"),
          fontSize: 17.sp,
          fontWeight: FontWeight.w500,
        ),
        indicator: TabIndicator(
          borderSide: BorderSide(width: 2.w, color: COLOR.hexColor("#eb29c6")),
          indicatorBottom: 10.w,
          indicatorWidth: 18.w,
        ),
        dividerHeight: 0,
        isScrollable: true,
        indicatorWeight: 1,
        tabAlignment: TabAlignment.center,
        labelPadding: EdgeInsets.only(right: 20.w),
      ),
      centerTitle: true,
      actions: <Widget>[
        Obx(() {
          return Visibility(
              maintainSize: true,
              maintainAnimation: true,
              maintainState: true,
              maintainInteractivity: false,
              visible: controller.activeIdx.value != 0,
              child: SizedBox(
                child: Builder(builder: (context) {
                  return Row(
                    children: <Widget>[
                      Text(
                        "筛选",
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          color: COLOR.hexColor("#fff"),
                          fontSize: 14.0,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                      Image.asset(
                        "assets/mine/icon_filter.png",
                        width: 20.w,
                        height: 20.w,
                      ),
                    ],
                  ).onOpaqueTap(() {
                    Scaffold.of(context).openEndDrawer();
                  });
                }),
              )).baseMarginHorizontal;
        }),
      ],
      bottom: PreferredSize(
        preferredSize: const Size.fromHeight(0.5),
        child: Container(
          height: 0.5,
          color: COLOR.hexColor("#393549"),
        ),
      ),
    );
  }

  Widget _buildContentView(BuildContext context) {
    return TabBarView(
      children: tabs.map((_) {
        return KeepAliveWrapper(
          child: Container(
            alignment: Alignment.center,
            child: _ == '明星'
                ? const StarPage()
                : _ == '创作者'
                    ? const CreatorPage()
                    : const ProducerPage(),
          ),
        );
      }).toList(),
    );
  }

  void onBackClick(BuildContext context) {
    Navigator.pop(context);
  }
}
